User blog:Razorgirl/Wiki Coding 101
You don't need to know html in order to create Wiki pages, and Wikia's visual editor helps to make things SUPER easy. I learned how to code Wikis with a Wiki that didn't have a visual editor, and thus I had to learn how to format wiki pages using Wiki code. It sounds a lot harder than it is. While Using Wikia's visual editor can be grand, sometimes it doesn't quite give you what you want. That's when you'll want to look at the code for the page in the Source tab just to check that nothing weird has happened while you were distracted sending your Sworn Swords out on Adventures to farm those precious Resources. ; ) While using the Visual Editor will handle most "quick and dirty" additions to the Wiki, if you ever want to edit the info you have for a template, the only way you can do this is in "Source Mode". So here are a few things to help you learn the basics, that will hopefully make contributing to this Wiki a little bit easier for you. Remember: You don't get paid to do this, so only do what's fun for you. If it's not fun, don't do it, and don't be afraid to ask one of the top contributors (whom are all listed on the for help. 'User Page' Before you can do anything, you should set up your own User Page so that people know who you are. If you're known in the Forums under a different Handle (Screen Name), I suggest that you list it on your Userpage so that you can get "credit where due". You may wish to use the Profile Template to add some info about the character you play in the game. 'Links' To link to another page, simply put the title of the page in two square brackets ( and ) on either side. You can use spaces so there's no need to use underscores ( _ ). For example, to list to the [Assignments page, simply put two open square brackets ( ) at the start and two closed square brackets ( ) at the end. :eg. Daily Assignments 'Links to Sub-Headings' Sometimes you may want to link to a heading within a page, which you can do by putting a hash mark (#) followed by the name of the heading. :eg. Professor#Lessons Links with different names Sometimes you may want to link to a page with different text than the name of the page. For example, you might want to list a link for Serpents to go House Slytherin's page. To do this, simply add the name of the link and then use a vertical line ( | ) to separate what you want the text to say. :eg. Serpents Broken Links If the page that the link points to is empty, it will come up in red to alert you to the fact that the link won't work. Either you got the page name wrong, or the page is empty/hasn't been created yet. Try to avoid making broken links. If the link comes up in blue, the link will work. Creating a New Page There are two ways to create a new page. All will work exactly the same way, and which way you choose to use is completely up to personal choice. :Option 1: Create a Link :If you are coding a page and you need to create another page that is related to the page you're on, just create a link with the Name of Your New Page. Watch that case that you use when you do this, as the case you use will be the case of the page, and thus the case of the Title at the top of the page. Once you save the changes to your comment or page, the link will come up in Red to indicate that it's a broken link. Click on the link and you will be taken to the new page with the name you've specified and then all you need to do is to hit the button that says, "Create" and to add your content. :Option 2: Hard Code the URL :Another option is to just type into the URL the name of the new page I want to create. Every page in this wiki will have the preface - http://gotascent.wikia.com/wiki/ - so all you need to do is to delete the name of the page you're on and to Type in the "Name of the Page" you wish to create, remembering to take care of which Case you use. The Wiki will change any spaces you use into underscores. Once you hit "Enter", you will be taken to the new page and then all you need to do is to hit the button that says, "Create". Formatting Font Wiki uses different code to normal html. For the most part, formatting font in Wikia Wikis is as easy as clicking on the icons as you would using Word™ (or similar). However, sometimes the visual editor doesn't quite do what you want it to do and you'll need to look at the Source tab to look at the code. Wiki code uses its own formatting language using sing quote marks ( ' ). Italics To make font in bold, put two quote marks ( ' ) at the start and end of the text you want in italics. :eg. This is an example of making a single word in 'italics' instead of normal text. Bold To make font in bold, put three quote marks ( ' ) at the start and end of the text you want in bold. :eg. This is an example of making a single word in 'bold' instead of normal text. 'Bold Italics' To make font in bold, put four quote marks ( ' ) at the start and end of the text you want in bold italics. ::'Bold Italics' * Bullet Points Put a space and then an asterisks ( * ) at the start of the sentence. ::* Bullet Points : Indented'' : Put a colon ( : ) at the start of each sentence you want indented. ::: Indented text '''Indented and isolated Put a space at the start of the sentence to have your text indented and boxed in a dotted line. Coloured Text Coloured text needs a little html to work. Very simply, use triangular brackets ( < and > ) when creating this code. The easiest way to explain this one is to show you so that you can see where to put them. eg. This is a sentence that wants a green coloured word in it. If you want to be really specific as to which colour you want to use, you can define the colour by its html name, which you can find by using this html Colour Chart. 'Headings and Subheadings' There are four basic forms of headings in Wikis. Each of them use an equal sign ( = ) at the start and end of each heading: :eg... : This would make a level two heading : This would make a four two heading This is what the first four levels of headings look like: =Level One Headings= It has one equal sign at the start and end. This text was put on the line underneath Level Two Heading This is a Level Two Heading and has two equal signs at the start and end of the heading. Level Three Heading This is a Level Three Heading. Note that this level of heading doesn't have the line to divide it across the page. Level Four Heading Just as with level three, level four headings becomes text that is slightly larger. Just with regular text, you can use Code inside Headings to make them link to pages, or to have the text in Italics or in Bold. Personally, I like my headings to all be in bold. For me, headings that aren't in Bold don't stand out enough, which is what a heading is supposed to do. When the headings above are put in bold they look like this: ='Level One Headings'= It has one equal sign at the start and end, but with three single quote marks on either side of the text. Again, this text was put on the line underneath. 'Level Two Heading' This is a Level Two Heading and has two equal signs at the start and end of the heading, but with three single quote marks on either side of the text. 'Level Three Heading' This is a Level Three Heading with bold text. Again, note that this level of heading doesn't have the line to divide it across the page. 'Level Four Heading' Just as with level three, level four headings becomes text that is slightly larger.... And this is what it looks like when you make it in bold as well. 'Images' There are two ways to put an image into a Wiki. One is to just slot it in as a large graphic, the other is to add it as a thumbnail. 'Large Graphics' To add an image, simply use the following code: * The "left" (or you could put "center" or "right") must be in lower case. The code above results in the image to the left. You must have the name of the graphic _exact_. The name is case sensitive and must have the correct file type/extension. As noted above, you can change the alignment from left to right or in the center, but please remember file names are CASE SENSITIVE so make sure you get your Captialisation correct. 'Thumb Nails' Another way to ad an image to a Wiki page is to put it in as a thumbnail. Browsers can still see the graphic at full size by clicking on it, but it now gives you a boarder around the image and the option to add a caption underneath. ]] * ]] The text above will give you a graphic like the one to the right. Note the extra square brackets within the caption that creates a link - but be careful to put a second lot of double square brackets to close off the code for the Image. Again, you must have the exact name of the graphic (remembering that it is case sensitive) and must have the correct file type/extension. 'Learning New Tricks' Using Wiki code gets easier with practice. If you see an effect on a page that you'd like to use on one of your own, go to the source tab to see how it was done. This is the easiest way to teach yourself new tricks to use in Wikis. For more details, see: * * Wiki Editing * the Wiki Tables * the Wikipedia Editing Cheatsheet and * the Full List of Wikipedia Markup Codes. That's all for now. I may do another one of these with some instructions on other things like polls, tables, and maybe one on templates. Happy coding! Raz : ) Category:Blog posts Category:Tutorials